<template>
  <el-card class="box-card">
    <el-form :model="infoData" label-width="120px">
      <el-alert type="info" show-icon :closable="false">
        <p>此页面用于员工考勤打卡时，所需浏览的安全警示信息</p>
      </el-alert>
      <el-form-item label="图文内容">
        <TEditor :content="infoData.content" ref="teditor"/>
      </el-form-item>
      <el-form-item label="音频内容">
        <upAudio @upload-success="handleSuccess" :audios="audios"/>
      </el-form-item>
      <el-form-item label="视频内容">
        <upload-video
          :videos="videos"
          :videoBaseUrl="IMAGEURL"
          @upload-success="videoSuccess"
           >
        </upload-video>
      </el-form-item>
      <el-form-item label="收看最小时长(秒)">
        <el-input-number :min="0" v-model="infoData.min_view_time" />
      </el-form-item>
      <el-form-item>
        <div style="width: 100%;display: flex;justify-content: center;">
          <el-button type="primary" @click="onSubmit">保存修改</el-button>
        </div>
      </el-form-item>
    </el-form>
  </el-card>
</template>

<script setup lang='ts'>
import { reactive, ref } from 'vue';
import TEditor from '@/components/TEditor.vue';
import UploadVideo from '@/components/upVideo.vue'
import upAudio from '@/components/upAudio.vue';
import useCurrentInstance from '@/utils/useCurrentInstance';

const { proxy } = useCurrentInstance()
let audios = ref([]) as any
let videos = ref([]) as any
const infoData = reactive({
  id:'',
  type:'20',
  content:'',
  audio:'',
  video:'',
  min_view_time:30,
  answer_number:0
})
const IMAGEURL = ref('')

// 提交
const teditor = ref()
const onSubmit = () => {
  infoData.content = teditor.value.content
  proxy.$api.setCompanyReminder(infoData).then(res => {
    if(res.code == 200){
      proxy.$message({
        type:'success',
        message:res.msg
      })
      getCompanyReminder()
    }
  })
}
// 上传音频成功
const handleSuccess = (url) => {
  infoData.audio = url
}
// 上传视频成功
const videoSuccess = (url) => {
  infoData.video = url
}
// 获取晨会资料
const getCompanyReminder = () => {
  proxy.$api.getCompanyReminder({type:20}).then(res => {
    for(let key in infoData){
      infoData[key] = res.result[key]
    }
    let url1 = res.result.audio
    let url2 = res.result.video
    audios.value = url1.indexOf('http') !== -1 ? [{name:url1.substring(url1.lastIndexOf('/')+1),url:res.result.audio}] : []
    videos.value = url2.indexOf('http') !== -1 ? [{name:url2.substring(url2.lastIndexOf('/')+1),url:res.result.video}] : []
  })
}
getCompanyReminder()
</script>

<style lang='scss' scoped>
p{
  margin: 0;
  padding: 0;
  padding-bottom: 10px;
  text-align: right;
  font-size: 14px;
}
.el-form{
  width: 60%;
}
.el-alert{
  background-color: rgba(255, 255, 255, 0) !important;
}
</style>
